<script setup>
const DATE_TYPE_LIST = [
  {label: '日期', tip: 'YYYY-MM-DD', value: 'date'},
  {label: '周', tip: 'YYYYwZZ', value: 'week'},
  {label: '年', tip: 'YYYY', value: 'year'},
  {label: '月', tip: 'YYYY-MM', value: 'month'},
  {label: '时间', tip: 'Y-M-D H:m:s', value: 'datetime'},
  {label: '时间分钟', tip: 'Y-M-D H:m', value: 'ymdhm'},
  {label: '时间小时', tip: 'Y-M-D H', value: 'ymdh'},
  // 'dates',    // 多个日期
];

defineProps({
  ext: Object
})
</script>

<template>
  <div class="ele-prop-item elem-design-prop-logic" v-if="ext">
    <!--<h5>主题</h5>-->
    <el-form>
      <el-form-item label="日期格式">
        <el-radio-group v-model="ext.dateFormat" size="mini">
          <el-row :gutter="5">
            <!--<template v-if="item.multi_mode === 'Y'">
                <el-col :span="12" v-for="t in DATE_TYPE_RANGE" :key="t">
                    <el-radio :label="t.value" border v-tippy="{ arrow: true }" :content="t.label + '：' + t.tip"
                              style="width: 100%;margin-bottom: 10px;padding-right:10px;">{{t.tip}}
                        &lt;!&ndash;<span v-text="t.tip" style="float: right;"></span>&ndash;&gt;
                    </el-radio>
                </el-col>
            </template>
            <template v-else>-->
            <el-col :span="12" v-for="t in DATE_TYPE_LIST" :key="t">
              <el-radio
                :label="t.value"
                border
                v-tippy
                :content="t.label + '：' + t.tip"
                class="w-full mb-2 pr-2"
              >{{ t.tip }}
                <!--<span v-text="t.tip" style="float: right;"></span>-->
              </el-radio>
            </el-col>
            <!--</template>-->
          </el-row>
        </el-radio-group>
      </el-form-item>
    </el-form>
  </div>
</template>
